<template>
  <div class="app-container">
    <div class="nav">
      <h1 class="nav-title">门诊医生工作站</h1>
    </div>
    <!-- 为导航栏留出空间 -->
    <div class="content-container">
      <slot />
    </div>
  </div>
</template>

<script setup>
import { useRouter } from 'vue-router';
const router = useRouter();
</script>

<style scoped>
.nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 2.5rem;
  line-height: 2.5rem;
  font-size: 1rem;
  background-color: #fff;
  box-shadow: 1px 1px 3px 3px #eee;
  padding: 0 1rem;
  z-index: 1000; /* 确保导航栏在最上方 */
}

.nav .nav-title {
  width: 100%;
  height: 2.5rem;
  line-height: 2.5rem;
  text-align: center;
  font-size: 1rem;
  margin: 0;
}

.app-container {
  background-color: #f4f4f4; /* 浅灰色背景 */
  padding: 0; /* 调整内边距 */
}

.content-container {
  padding-top: 2.5rem; /* 为导航栏留出空间 */
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: 20px;
}
</style>    